<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8" isELIgnored="false" %>
<%@page import="co.gov.medellin.ssti.sub.common.util.Utility"%>
<%@page import="co.gov.medellin.ssti.sub.common.util.FiltrosReportesUtil"%>
<%@ taglib uri="/WEB-INF/struts-html.tld" prefix="html"%>
<%@ taglib uri="/WEB-INF/struts-logic.tld" prefix="logic"%>
<%@ taglib uri="/WEB-INF/struts-bean.tld" prefix="bean"%>
<%@ taglib uri="/WEB-INF/displaytag.tld" prefix="display"%>
<%@ page import="java.util.*"%>

<script src="<%=request.getContextPath()%>/js/displaytag.js"
	type="text/javascript"></script>
<script type="text/javascript"
	src="<%= request.getContextPath() + "/js/popUP.js" %>"></script>
<link href="<%= request.getContextPath() + "/css/bloques.css" %>"
	rel="stylesheet" type="text/css">
<link href="<%= request.getContextPath() + "/css/table.css" %>"
	rel="stylesheet" type="text/css">
<script src="<%=request.getContextPath()%>/js/dateValidation.js"
	type="text/javascript"></script>
<script type="text/javascript"
	src="<%=request.getContextPath() + "/js/jquery-1.8.0.js"%>"></script>
<script type="text/javascript"
	src="<%=request.getContextPath()
					+ "/js/jquery-ui-1.10.3.custom.min.js"%>"></script>
<script type="text/javascript"
	src="<%=request.getContextPath()
					+ "/js/jquery.ui.datepicker-es.js"%>"></script>
<link rel="stylesheet"
	href="<%=request.getContextPath()
					+ "/css/ui-lightness/jquery-ui-1.10.3.custom.css"%>" />


<script type="text/javascript">
$(document).ready(function() {
	// solo se mostrara cuando se elija el operador Entre (BETWEEN) para fechas y numeros.
	$("#inputValor2").hide();
	$("#inputValor2Fecha").hide();
	
	// si es el operador BETWEEN debe mostrar 2 elementos para ingresar el rango.		
	if($("#operadorSelect").val() == '<%=FiltrosReportesUtil.ENTRE%>'){
		if($("#tipoCampo").val() == '<%=FiltrosReportesUtil.TIPO_FECHA%>' ){
			$("#inputValor2").hide().val("");
			$("#inputValor2Fecha").show().val("");
		}else{
			$("#inputValor2Fecha").hide().val("");
			$("#inputValor2").show().val("");
		}
	}else{
		$("#inputValor2Fecha").hide().val("");
		$("#inputValor2").hide().val("");
	}
	
	$("#buscarBtn").click(function(){		
		var action = '<%=request.getContextPath()+"/Reportes/Totales/ReportTotalBOT.do"%>';
		$("input[id='operacion']").val("<%=Utility.OP_GENERAR_REPORTE%>");
		$("#mainForm").attr("target","_BLANK");
		$("#mainForm").attr("action", action);
			
		if( ($("#fechaIni").val() == '' && $("#fechaFin").val() == '')){
			$("#mainForm").submit();
		}else{
			var fIniValida = isDate($("#fechaIni").val());
			var fFinValida = isDate($("#fechaFin").val());
			if(!fIniValida){
				alert('Fecha inicial no valida.');
				return false;
			}else if(!fFinValida){
				alert('Fecha final no valida.');
				return false;
			}else{
				if( $.datepicker.parseDate("dd/mm/yy", $("#fechaIni").val()) > $.datepicker.parseDate("dd/mm/yy", $("#fechaFin").val())){
					alert('Fecha inicial no puede ser mayor que la fecha final.');
					return false;
				}
			}
			$("#mainForm").submit();
		}			
	});
	
	//cuando cambia el valor seleccionado de la lista de areas.
	$("#area").change(function(){		
		var action = '<%=request.getContextPath()+"/Reportes/Totales/ReportTotalBOT.do"%>';
		$("#mainForm").attr("action", action);
		$("#mainForm").attr("target", "_self");
		$("input[id='operacion']").val("<%=Utility.OP_SELECT_AREA%>");
		$("#mainForm").submit();
	});
	
	//cuando cambia el valor seleccionado de la lista de programas.
	$("#programa").change(function(){				
		var action = '<%=request.getContextPath()+"/Reportes/Totales/ReportTotalBOT.do"%>';
		$("#mainForm").attr("action", action);
		$("#mainForm").attr("target", "_self");
		$("input[id='operacion']").val("<%=Utility.OP_SELECT_PROGRAMA%>");
		$('#mainForm').submit();
	});
	
	//cuando cambia el valor seleccionado de la lista de programas.
	$("#subprograma").change(function(){				
		var action = '<%=request.getContextPath()+"/Reportes/Totales/ReportTotalBOT.do"%>';
		$("#mainForm").attr("action", action);
		$("#mainForm").attr("target", "_self");
		$("input[id='operacion']").val("BuscarSiTieneAtributo");
		$('#mainForm').submit();
	});
	
	//Filtros reporte.
	// cuando cambia el select de atributos debe asignar los filtros apropiados.
	$("#atributoSelect").change(function() {
	    $("input[id='etiquetaValor1']").val("");
	    $("input[id='etiquetaOperador']").val("");
	    $("input[id='etiquetaAtributo']").val("");		
	    //hidden field operacion
		$("input[id='operacion']").val("<%=Utility.OP_SELECT_ATRIBUTO%>");	
	    $("#mainForm").attr('target', '_self');		
		$("form#mainForm").submit();
	});
	
	// cuando cambia el select de operador
	$('#operadorSelect').change(function() {
		// si es el operador BETWEEN debe mostrar 2 elementos para ingresar el rango.		
		if($("#operadorSelect").val() == '<%=FiltrosReportesUtil.ENTRE%>'){
			if($("#tipoCampo").val() == '<%=FiltrosReportesUtil.TIPO_FECHA%>' ){
				$("#inputValor2").hide().val("");
				$("#inputValor2Fecha").show().val("");
			}else{
				$("#inputValor2Fecha").hide().val("");
				$("#inputValor2").show().val("");
			}
		}else{
			$("#inputValor2Fecha").hide().val("");
			$("#inputValor2").hide().val("");
		}
	});
	
	$('#addFilter').click(function() {
		if($("#atributoSelect").val() === ""){
			alert("Seleccione un atributo.");
			return;
		}
		// si ningun valor 1 ha sido ingresado
		if($("#inputValor1Fecha").val() != "undefined" && $("#inputValor1Fecha").val() === ""){
			alert("Ingrese un valor1");
			return;
		}
		if(typeof $("#inputValor1").val != "undefined" && $("#inputValor1").val() === ""){
			alert("Ingrese un valor1");
			return;
		}
		if(typeof $("#valor1Select").val() != "undefined" && $("#valor1Select").val() === ""){
			alert("Ingrese un valor1");
			return;
		}
		
		
		//hidden field operacion
		$("input[id='operacion']").val("<%=Utility.OP_ADD_FILTRO%>");
		//asignar valores 
		$("input[id='etiquetaAtributo']").val($('#atributoSelect option:selected').text());
		$("input[id='etiquetaOperador']").val($('#operadorSelect option:selected').text());
		if(typeof $("#valor1Select").val() != "undefined" && $("#valor1Select").val() != ""){
			$("input[id='etiquetaValor1']").val($('#valor1Select option:selected').text());
		}else if(typeof $("#inputValor1Fecha").val() != "undefined" && $("#inputValor1Fecha").val() != ""){
			$("input[id='etiquetaValor1']").val($('#inputValor1Fecha option:selected').text());
		}
		$("form#mainForm").submit();		
	});
	
	
	// Se hace que el ID del atributo a eliminar sea el valor "codigos" (es decir la posicion a eliminar).
	// Se usa un onclick para la clase deleteBtn, se obtiene el valor del id del boton al que se le hizo click,
	// y luego se asigna este valor al parametro del request "codigos", que es el que indica la posicion de filtros
	// a borrar. FSR.
	$(".deleteBtn").click(function(){
		var chosen = confirm('¿Está seguro que desea eliminar el filtro?');
		if(chosen){
			var id = this.id;
			// como se le concateno 'delete' al id(por evitar posible id repetido..), 
			// se remueve (solo se necesita el numero).
			id = id.replace('delete','');
			$("input[id='operacion']").val("<%=Utility.OP_DELETE_FILTRO%>");
			$('input[name=indexFilter]').val(id);	// el numero o posicion del filtro a eliminar.
			$("#mainForm").attr('target', '_self');
			$("#mainForm").submit();	
		}
		return false;
	});
	
});
</script>

<!-- DatePickers -->
<script type="text/javascript">
$.datepicker.setDefaults({
	  showOn: "button",
	  buttonImageOnly: true,
	  buttonImage: "<%=request.getContextPath() + "/images/Calendar.png"%>",
	  buttonText : "Calendario"
	});
	$(function() {
		$("#fechaIni").datepicker({
			changeMonth : true,
			changeYear : true
		});
	});
	$(function() {
		$("#fechaFin").datepicker({
			changeMonth : true,
			changeYear : true
		});
	});
</script>

<!-- Fechas filtros -->
<script>
	$(function() {
		$("#inputValor1Fecha").datepicker({
			changeMonth : true,
			changeYear : true
		});
		
		$("#inputValor2Fecha").datepicker({
			changeMonth : true,
			changeYear : true
		});
	});
</script>


<form name="mainForm" id="mainForm"
	action="<%=request.getContextPath()+"/Reportes/Totales/ReportTotalBOT.do"%>"
	method="post">	
	<!--<input type="HIDDEN" name="codigo" id="codigo" value="nulo">--> 
	<!--<input type="HIDDEN" name="acciones" id="acciones">--> 
	<!--<input type="HIDDEN" name="posicion" id="posicion"/>-->
	<!--<input type="hidden" name="fechaInicial" value="" id="fechaInicial"/>--> 
	<!--<input type="hidden" name="fechaFinal" value="" id="fechaFinal"/>-->
	
	<html:hidden name="ReportTotalBOTForm" property="tipoCampo" styleId="tipoCampo"></html:hidden>
	<html:hidden name="ReportTotalBOTForm" property="etiquetaAtributo" styleId="etiquetaAtributo"></html:hidden>
	<html:hidden name="ReportTotalBOTForm" property="etiquetaOperador" styleId="etiquetaOperador"></html:hidden>
	<html:hidden name="ReportTotalBOTForm" property="etiquetaValor1" styleId="etiquetaValor1"></html:hidden>
	<html:hidden name="ReportTotalBOTForm" property="operacion" styleId="operacion" ></html:hidden>
	<html:hidden name="ReportTotalBOTForm" property="indexFilter" styleId="indexFilter"></html:hidden>

	<div align="center">
		<table class="tablaGenericaWidth70">
			<tr>
				<td class="titulosenblanco" colspan="3">
					<DIV align="center">
						<STRONG>Reporte&nbsp;Total&nbsp;Beneficios Otorgados</STRONG>
					</DIV>
				</td>
			</tr>
			<tr>
				<td class="titulosenblanco" colspan="3">&nbsp;</td>
			</tr>
			<tr>
				<td align="center" class="celdatabla" colspan="3">
					Seleccione los criterios de busqueda
				</td>
			</tr>
			<tr>
				<td class="titulosenblanco" colspan="3">&nbsp;</td>
			</tr>
			<tr>
				<td class="celdatabla" width="31%">Sede:</td>
				<td width="44%">
					<logic:notPresent name="ReportTotalBOTForm" property="sedes">
						<DIV align="center">
							<%= session.getAttribute("msg")%>
							<%session.removeAttribute("msg");%>
						</DIV>
					</logic:notPresent> 
					
					<div align="left">
						<logic:present name="ReportTotalBOTForm" property="sedes">							
							<html:select name="ReportTotalBOTForm" styleId="sede" property="codeSede" title="Sede"
								styleClass="formInputOutput">
								<option value="" selected="selected">Seleccione una sede</option>
								<html:optionsCollection name="ReportTotalBOTForm" 
									property="sedes" label="nombre" value="codeSede" />
							</html:select>							
						</logic:present>
					</div></td>
				<td class="celdatabla" width="25%">&nbsp;</td>
			<tr>
				<td class="celdatabla" width="31%">Secretarias:</td>
				<td width="44%">
					<logic:empty name="ReportTotalBOTForm" property="areas">
						<DIV align="center">
							<%= session.getAttribute("msg")%>
							<%session.removeAttribute("msg");%>
						</DIV>
					</logic:empty>

					<div align="left">
						<logic:present name="ReportTotalBOTForm" property="areas">
							<html:select name="ReportTotalBOTForm" styleId="area" property="codeArea" title="Area"
								styleClass="formInputOutput">
								<option value="" selected="selected">Seleccione una secretaria</option>
								<html:optionsCollection name="ReportTotalBOTForm"
									property="areas" label="nombre" value="codearea" />
							</html:select>							
						</logic:present>
					</div>
				</td>
				<td class="celdatabla" width="25%">&nbsp;</td>
			</tr>

			<tr>
				<td class="celdatabla" width="31%">Programa:</td>
				<td width="44%">
					<logic:empty name="ReportTotalBOTForm" property="programas">
						<DIV align="center">
							<%= session.getAttribute("msg")%>
							<%session.removeAttribute("msg");%>
						</DIV>
					</logic:empty>
					<div align="left">
						<logic:present name="ReportTotalBOTForm" property="programas">							
							<html:select name="ReportTotalBOTForm" styleId="programa" property="codePrograma"
								title="Programa" styleClass="formInputOutput">
								<option value="">Seleccione un programa</option>
								<html:optionsCollection name="ReportTotalBOTForm" 
									 property="programas" label="nombre" value="code"/>
							</html:select>							
						</logic:present>
					</div>
				</td>
				<td class="celdatabla" width="25%">&nbsp;</td>
			</tr>
			<!-- present programa -->
			<logic:present name="ReportTotalBOTForm" property="codePrograma">
				<tr>
					<td class="celdatabla" width="31%">Beneficio:</td>
					<td width="44%">
						<div align="left">
							<logic:empty name="ReportTotalBOTForm" property="subprogramas">
								<DIV align="center">
									<%= session.getAttribute("msg")%>
									<%session.removeAttribute("msg");%>
								</DIV>
							</logic:empty>
	
							<logic:notEmpty name="ReportTotalBOTForm" property="subprogramas">							
								<html:select name="ReportTotalBOTForm" styleId="subprograma" property="codeSubprograma"
									title="Programa" styleClass="formInputOutput" >
									<option value="" selected="selected">Seleccione un subprograma</option>
									<html:optionsCollection name="ReportTotalBOTForm"
										property="subprogramas" label="nombre" value="code"/>
								</html:select>
							</logic:notEmpty>
						</div>
					</td>
					<td class="celdatabla" width="25%">&nbsp;</td>
				</tr>
			</logic:present>
			
			<tr>
				<logic:notEmpty name="ReportTotalBOTForm" property="gestores">
					<td class="celdatabla" width="31%">Gestor:</td>
					<td>
						<div align="left">
							<html:select name="ReportTotalBOTForm" styleId="Gestor" property="codeVfl" title="Gestor"
								styleClass="formInputOutput">
								<option value="">Seleccione un gestor</option>
								<html:optionsCollection name="ReportTotalBOTForm"
									property="gestores" label="codigovfl" value="codigovfl" />
							</html:select>
						</div>						
					</td>
				</logic:notEmpty>
			</tr>

			<tr>
				<td class="celdatabla" width="31%">
					<p>
						<bean:message bundle="strings"
							key="reportes.totales.comuna.html.label.fechaini.name" />
					</p>
				</td>
				
				<td align="left" class="celdatabla">
					<html:text name="ReportTotalBOTForm" property="fechaIni" 
						styleId="fechaIni" styleClass="formInputOutput" />
				</td>

				<td class="celdatabla" width="25%">&nbsp;</td>
			</tr>
			
			<tr>
				<td class="celdatabla" width="31%">
					<p>
						<bean:message bundle="strings"
							key="reportes.totales.comuna.html.label.fechafin.name" />
					</p>
				</td>
				
				<td align="left" class="celdatabla">
					<html:text name="ReportTotalBOTForm" property="fechaFin" 
						styleId="fechaFin" styleClass="formInputOutput" />
				</td>

				<td class="celdatabla" width="25%">&nbsp;</td>
			</tr>
			
			<tr>
				<td class="celdatabla" width="31%">&nbsp;</td>
				<td width="44%">
					<div align="center">
						<input type="hidden" name="accion" id="accion" value="" />
						<input type="button" value="Generar" name="buscarBtn" id="buscarBtn" />
						<P>&nbsp;</P>
					</div>
				</td>
				<td class="celdatabla" width="25%">&nbsp;</td>
			</tr>
			<tr>
				<td colspan="3" align="center">
					<logic:present name="msg">
						<DIV align="center">
							<%=session.getAttribute("msg")%>
						</DIV>
						<%session.removeAttribute("msg");%>
					</logic:present>
				</td>
			</tr>
		</table>
	</div>
	
	
	
	<br>
	<hr align="center" width="50%">
	<p class="celdatabla" align="center">
		<bean:message bundle="strings" key="filters.html.text.header.name" />
	</p>

	<div align="center">
		<table class="tablaGenericaWidth10">
			<tr>
				<td align="center" class="celdatabla"><bean:message
						bundle="strings" key="filters.html.text.parameter.name" /></td>
				<td align="center" class="celdatabla"><bean:message
						bundle="strings" key="filters.html.text.filter.name" /></td>
				<td align="center" class="celdatabla"><bean:message
						bundle="strings" key="filters.html.text.value1.name" /></td>
				<td align="center" class="celdatabla"><bean:message
						bundle="strings" key="filters.html.text.value2.name" /></td>
			</tr>
			
			<tr>
				<td>
					<div align="center">
						<html:select name="ReportTotalBOTForm" property="codeAtributo"
							title="Atributos" styleClass="form" styleId="atributoSelect">
							<html:option value="">
								<bean:message bundle="strings" key="filters.html.option.atributo.name" />
							</html:option>
							<html:optionsCollection name="ReportTotalBOTForm" 
								property="codAtributos"  label="etiqueta" value="nombre" />
						</html:select>
					</div>
				</td>
				<td>
					<logic:present name="ReportTotalBOTForm" property="operadores">
						<html:select name="ReportTotalBOTForm" property="codeOperador"
							title="Operadores" styleClass="form" styleId="operadorSelect">
							<html:optionsCollection name="ReportTotalBOTForm"
								property="operadores" label="filtro" value="codFiltro" />
						</html:select>
					</logic:present>
				</td>
				
				<td>
					<!-- input cuando son valores no conocidos ingresados por el usuario -->
					<logic:notPresent name="ReportTotalBOTForm" property="valores1">
						<logic:notEqual name="ReportTotalBOTForm" property="tipoCampo"
							value="<%=FiltrosReportesUtil.TIPO_FECHA%>">
							<html:text name="ReportTotalBOTForm" property="valor1"
								styleClass="form" styleId="inputValor1" />
						</logic:notEqual>
					</logic:notPresent> 
					
					<!-- input fecha -->
					<logic:notPresent name="ReportTotalBOTForm" property="valores1">
						<logic:equal name="ReportTotalBOTForm" property="tipoCampo"
							value="<%=FiltrosReportesUtil.TIPO_FECHA%>">
							<html:text name="ReportTotalBOTForm" property="valor1"
								styleClass="form" styleId="inputValor1Fecha" />
						</logic:equal>
					</logic:notPresent>
					
					<!-- select cuando es lista de valores conocidos -->
					<logic:present name="ReportTotalBOTForm" property="valores1">
						<logic:notEqual name="ReportTotalBOTForm" property="tipoCampo"
							value="<%=FiltrosReportesUtil.TIPO_FECHA%>">
							<html:select name="ReportTotalBOTForm" property="valor1"
								title="Valor1" styleClass="form" styleId="valor1Select">
								<option value="">
									<bean:message bundle="strings"
										key="filters.html.option.valor1.name" />
								</option>								
								<html:optionsCollection name="ReportTotalBOTForm"
									property="valores1" label="filtro" value="codFiltro" />
							</html:select>
						</logic:notEqual>
					</logic:present>

				</td>
				
				<td>
					<!-- input cuando son valores no conocidos ingresados por el usuario -->
					<logic:notPresent name="ReportTotalBOTForm" property="valores2">
						<logic:notEqual name="ReportTotalBOTForm"
							property="tipoCampo"
							value="<%=FiltrosReportesUtil.TIPO_FECHA%>">
							
							<html:text name="ReportTotalBOTForm" property="valor2"
								styleClass="form" styleId="inputValor2" />
								
						</logic:notEqual>
					</logic:notPresent> 
					
					<!-- input fecha --> 
					<logic:notPresent name="ReportTotalBOTForm" property="valores2">
						<logic:equal name="ReportTotalBOTForm" property="tipoCampo"
							value="<%=FiltrosReportesUtil.TIPO_FECHA%>">
				
								<html:text name="ReportTotalBOTForm" property="valor2"
									styleClass="form" styleId="inputValor2Fecha" />
							
						</logic:equal>
					</logic:notPresent>

				</td>
			</tr>
			
			<tr>
				<td align="center" colspan="4">
					<P>&nbsp;</P>
					<P>
						<html:button  styleId="addFilter" property="">
							<bean:message bundle="strings" key="filters.html.button.add.name" />
						</html:button>
					</P>
				</td>
			</tr>
		</table>
	</div>
	
	<div align="center">
	
		<logic:present name="ReportTotalBOTForm" property="filtros">
			<table class="tablaGenericaWidth50">
				<tr>
					<td>
						<display:table name="sessionScope.filtrosReportTotalBOT"
								id="filtersTable" cellpadding="3" cellspacing="1" style="width:100%"
								class="bordestable">
								<display:column headerClass="headerTable" title="Atributo"
									class="Numero" sortable="false">
									<div align="center">
										<bean:write name="filtersTable" property="campo" />
									</div>
								</display:column>
								<display:column headerClass="headerTable" title="Filtro"
									class="Numero" sortable="false">
									<div align="center">
										<bean:write name="filtersTable" property="filtro" />
									</div>
								</display:column>
								<display:column headerClass="headerTable" title="Valor1"
									class="Numero" sortable="false">
									<div align="center">
										<bean:write name="filtersTable" property="etiquetaValor" />
									</div>
								</display:column>
								<display:column headerClass="headerTable" title="Valor2"
									class="Numero" sortable="false">
									<div align="center">
										<bean:write name="filtersTable" property="etiquetaValor2" />
									</div>
								</display:column>
								
								<display:column headerClass="headerTable" title="Eliminar"
									class="Numero" sortable="true">
									<div align="center">
										<html:image src='<%=request.getContextPath() + "/images/Delete.gif"%>' styleId='delete${filtersTable_rowNum}'
											style="width: 16; height: 16; border: 0;" styleClass="deleteBtn" />									
									</div>
								</display:column>
							</display:table>
						</td>
				</tr>
			</table>
		</logic:present>
	</div>
	
</form>